
function show_statistics(str){
var xmlHttp;
	try{
		xmlHttp=new XMLHttpRequest();// Firefox, Opera 8.0+, Safari
	}
	catch (e){
		try{
			xmlHttp=new ActiveXObject("Msxml2.XMLHTTP"); // Internet Explorer
		}
		catch (e){
		    try{
				xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
			}
			catch (e){
				alert("No AJAX!?");
				return false;
			}
		}
	}

xmlHttp.onreadystatechange=function(){
   // var answer=document.form_answer.answer.value;
    //document.write(answer);
	if(xmlHttp.readyState==4){
           var concat=xmlHttp.responseText;
           var arr=concat.split("&");
   var male_buildings_concat=arr[0];
   var male_patterns_array=male_buildings_concat.split("--");
   var female_buildings_concat=arr[1];
   var female_patterns_array=female_buildings_concat.split("--");
   //////////////////////male_canvas
               var male_canvas=document.getElementById('male_representation');
                var male_canvas_height=(male_patterns_array.length-1)*60;//define canvas height
                var male_context=male_canvas.getContext("2d");
                male_canvas.width=male_canvas.width;//clear canvas to draw
                male_context.fillStyle="black";
                male_canvas.height=male_canvas_height;
                male_context.fillRect(0, 0, 550, male_canvas_height);//set the canvas background height
                var male_value=5;
               ////////////female_canvas
               var female_canvas=document.getElementById('female_representation');
                var female_canvas_height=(female_patterns_array.length-1)*60;//define canvas height
                var female_context=female_canvas.getContext("2d");
                female_canvas.width=male_canvas.width;//clear canvas to draw
                female_context.fillStyle="black";
                female_canvas.height=female_canvas_height;
                female_context.fillRect(0, 0, 550, female_canvas_height);
                var female_value=5;
               ////////////////
               //////////represent male_buildings
           ////drow the bartchart
           /////determinig the grows of part chart

            var max_male_value=0;
           for(var g=0;g<male_patterns_array.length-1;g++){
            var male_pattern_properties=male_patterns_array[g].split("@");
             var male_num_of_student=male_pattern_properties[1];
             //alert(male_num_of_student);
             if(male_num_of_student > max_male_value){
                 max_male_value=male_num_of_student;
                 alert("max"+max_male_value);
             }else{
                 alert("min"+male_num_of_student);
             }
           }
           alert("final"+max_male_value);
             if(max_male_value*male_value>350){
   male_value/=(max_male_value/(male_value*male_value*(male_value/2)));
                 }
            //alert(max_male_value);
           for (var i=0;i<male_patterns_array.length-1;i++){
               var male_pattern_properties=male_patterns_array[i].split("@");
               var male_pattern_name=male_pattern_properties[0];
               var male_num_of_student=male_pattern_properties[1];
               if(male_num_of_student==max_male_value){
               male_context.fillStyle="darkmagenta";
               }else{
                male_context.fillStyle="blueviolet";
               }
                male_context.fillRect(200, 20+(i*60), male_num_of_student*male_value, 30);
                male_context.font="24px";
                male_context.fillText(male_pattern_name+"---"+male_num_of_student,0,40+(i*60));
           }
           /////drow the lines axis
           male_context.lineWidth="10";
           male_context.beginPath();
           male_context.moveTo(200, 0);
           male_context.lineTo(200,male_canvas_height-10);//variable
           male_context.lineTo(550, male_canvas_height-10);
           male_context.strokeStyle="aqua";
           male_context.stroke();
           
           //////////represent female_buildings
           ////// drow the part chart
           ////////determining grows value
           var max_female_value=0;
           for(var k=0;k<female_patterns_array.length-1;k++){
            var female_pattern_properties=female_patterns_array[k].split("@");
             var female_num_of_student=female_pattern_properties[1];
             if(female_num_of_student >= max_female_value){
                 max_female_value=female_num_of_student;
             }
           }
             if(max_female_value*female_value>350){
    female_value/=(max_female_value/(female_value*female_value*(female_value/2)));
                 }
            for(var j=0;j<female_patterns_array.length-1;j++){
               var female_pattern_properties=female_patterns_array[j].split("@");
               var female_pattern_name=female_pattern_properties[0];
               var female_num_of_student=female_pattern_properties[1];
                 if(female_num_of_student==max_female_value){
               female_context.fillStyle="darkmagenta";
               }else{
                female_context.fillStyle="blueviolet";
               }
                female_context.fillRect(200, 20+(j*60), female_num_of_student*female_value, 30);
                female_context.font="24 px";
                female_context.fillText(female_pattern_name+"---"+female_num_of_student,0,40+(j*60));
               
          }
             /////drow the lines axis
           female_context.lineWidth="10";
           female_context.beginPath();
           female_context.moveTo(200, 0);
           female_context.lineTo(200,female_canvas_height-10);//variable
           female_context.lineTo(550, female_canvas_height-10);
           female_context.strokeStyle="aqua";
           female_context.stroke();
           
	setTimeout('show_statistics()',3000);
	}
}
xmlHttp.open("GET","get_statistics.php?q="+str,true);
xmlHttp.send(null);
}
window.onload=function(){
	setTimeout('show_statistics()',3000);
}
